SherbyNet - /page/wikibook/entry.mu

Micron Document

<!DOCTYPE html>

<title>Button (computing)</title>

</head>

<span id="openzim-page-title" class="mw-page-title-main"><span class="mw-page-title-main">Button (computing)</span></span>

</h1>

</header>

/* start https://en.wikipedia.org/ */

.mw-parser-output .hatnote{font-style:italic}.mw-parser-output div.hatnote{padding-left:1.6em;margin-bottom:0.5em}.mw-parser-output .hatnote i{font-style:normal}.mw-parser-output .hatnote+link+.hatnote{margin-top:-0.5em}@media print{body.ns-0 .mw-parser-output .hatnote{display:none!important}}

/* end https://en.wikipedia.org/ */

</style><div role="note" class="hatnote navigation-not-searchable">For the buttons used to identify a program used to build a web site, see <a href="Web_button" class="mw-redirect" title="Web button">Web button</a>. For keyboard buttons, see <a href="Keyboard_(computing)" class="mw-redirect" title="Keyboard (computing)">Keyboard (computing)</a>.</div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .ambox{border:1px solid #a2a9b1;border-left:10px solid #36c;background-color:#fbfbfb;box-sizing:border-box}.mw-parser-output .ambox+link+.ambox,.mw-parser-output .ambox+link+style+.ambox,.mw-parser-output .ambox+link+link+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+style+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+link+.ambox{margin-top:-1px}html body.mediawiki .mw-parser-output .ambox.mbox-small-left{margin:4px 1em 4px 0;overflow:hidden;width:238px;border-collapse:collapse;font-size:88%;line-height:1.25em}.mw-parser-output .ambox-speedy{border-left:10px solid #b32424;background-color:#fee7e6}.mw-parser-output .ambox-delete{border-left:10px solid #b32424}.mw-parser-output .ambox-content{border-left:10px solid #f28500}.mw-parser-output .ambox-style{border-left:10px solid #fc3}.mw-parser-output .ambox-move{border-left:10px solid #9932cc}.mw-parser-output .ambox-protection{border-left:10px solid #a2a9b1}.mw-parser-output .ambox .mbox-text{border:none;padding:0.25em 0.5em;width:100%}.mw-parser-output .ambox .mbox-image{border:none;padding:2px 0 2px 0.5em;text-align:center}.mw-parser-output .ambox .mbox-imageright{border:none;padding:2px 0.5em 2px 0;text-align:center}.mw-parser-output .ambox .mbox-empty-cell{border:none;padding:0;width:1px}.mw-parser-output .ambox .mbox-image-div{width:52px}@media(min-width:720px){.mw-parser-output .ambox{margin:0 10%}}@media print{body.ns-0 .mw-parser-output .ambox{display:none!important}}

/* end https://en.wikipedia.org/ */

</style>

<p>In <a href="Computing" title="Computing">computing</a>, a <b>button</b> (sometimes known as a <b>command button</b> or <b>push button</b>) is a <a href="Graphical_control_element_(software)" class="mw-redirect" title="Graphical control element (software)">graphical control element</a> that provides the user a simple way to trigger an <a href="Event_(computing)" title="Event (computing)">event</a>, like searching for a query at a <a href="Search_engine" title="Search engine">search engine</a>, or to interact with <a href="Dialog_box" title="Dialog box">dialog boxes</a>, like confirming an action.<sup id="cite_ref-1" class="reference"><a href="#cite_note-1"><span class="cite-bracket">[</span>1<span class="cite-bracket">]</span></a></sup>

</p>

<div class="mw-heading mw-heading2"><h2 id="Overview">Overview</h2></div>

<p>A typical button is a rectangle or rounded rectangle, wider than it is tall, with a descriptive caption in its center.<sup id="cite_ref-2" class="reference"><a href="#cite_note-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup> However, a button is not always restricted to a rectangular shape. Other buttons may be square or round, with simple <a href="Icon_(computing)" title="Icon (computing)">icons</a>.

</p><p>The most common method of pressing a button is clicking it with a <a href="Pointer_(user_interface)" class="mw-redirect" title="Pointer (user interface)">pointer</a> controlled by a <a href="Mouse_(computing)" class="mw-redirect" title="Mouse (computing)">mouse</a> or <a href="Touchpad" title="Touchpad">touchpad</a>, but other inputs such as keystrokes can be used to execute the command of a button.

</p><p>The sole requirement of button interaction is that the user can execute a command by a <a href="Point-and-click" class="mw-redirect" title="Point-and-click">click</a> action. Thus, pictures and background areas can be programmed as buttons. When pressed, in addition to performing a predetermined task, buttons often undergo a graphical change to mimic a mechanical button being depressed.

</p><p>Depending on the circumstance, buttons may be designated to be pushed only once and execute a command, while others may be used to receive instant feed back and may require the user to click more than once to receive the desired result. Other buttons are designed to toggle behavior on and off like a <a href="Check_box" class="mw-redirect" title="Check box">check box</a>.<sup id="cite_ref-3" class="reference"><a href="#cite_note-3"><span class="cite-bracket">[</span>3<span class="cite-bracket">]</span></a></sup> These buttons will show a graphical clue (such as staying depressed after the mouse is released) to indicate the state of the option. Such a button may be called a latch button or a <a href="Latching_switch" title="Latching switch">latching switch</a>.

</p><p>A button often displays a <a href="Tooltip" title="Tooltip">tooltip</a> when a user moves the pointer over it, especially if the button's content is a standalone icon. The tooltip serves as built-in documentation that briefly explains the purpose of the button. If you hover your mouse over the blue window button below (without clicking it or moving your mouse), it will display a text saying "Window (computing)."

</p><p>Some very common incarnations of the button widget are:

</p>

<ul><li>An <i>OK button</i> for confirming actions and closing the windows</li>

<li>A <i>Cancel button</i> for canceling actions and closing the <a href="Window_(computing)" title="Window (computing)">window</a></li>

<li>An <i>Apply button</i> for confirming actions without closing the window</li>

<li>A <i>Close button</i> for closing windows after changes have already been applied</li></ul>

<div class="mw-heading mw-heading2"><h2 id="Appearance">Appearance</h2></div>

<div class="mw-heading mw-heading3"><h3 id="macOS">macOS</h3></div>

<div role="note" class="hatnote navigation-not-searchable">Further information: <a href="Aqua_(user_interface)" title="Aqua (user interface)">Aqua (user interface)</a></div>

<p>Buttons in <a href="MacOS" title="MacOS">macOS</a>'s <a href="Aqua_(user_interface)" title="Aqua (user interface)">Aqua</a> interface are usually depicted as rounded-rectangles of crystallized glass. Normally these buttons are light grey in color and turn blue when pressed. The button with keyboard focus (selectable with the spacebar) appears with a blue glow surrounding it. The default button in an <a href="Active_window" class="mw-redirect" title="Active window">active window</a> (selectable with the return key) animates between a bright blue and a darker blue (the same color as a pressed button).

</p><p>Also used, primarily within application toolbars, are slightly rounded rectangles with a light grey metallic appearance. These buttons appear darker and "pushed inward" when pressed.

</p><p>Window management controls appear in the top left corner of each window. These buttons are similar in style to standard aqua buttons, but are color-coded as a memory aid. From left to right, these are: "Close Window", shown in red; "Minimize Window", shown in yellow; and "Zoom", shown in green, which causes the window to resize to best fit its contents.

</p>

<div class="mw-heading mw-heading3"><h3 id="Windows_shell">Windows shell</h3></div>

<div role="note" class="hatnote navigation-not-searchable">Further information: <a href="Windows_shell" title="Windows shell">Windows shell</a></div>

<p>Buttons in <a href="Microsoft_Windows" title="Microsoft Windows">Microsoft Windows</a> are usually rectangular, with mildly rounded corners in <a href="Windows_XP" title="Windows XP">Windows XP</a>, <a href="Windows_Vista" title="Windows Vista">Vista</a>, and <a href="Windows_7" title="Windows 7">7</a>, in <a href="Windows_11" title="Windows 11">Windows 11</a>. In <a href="Windows_8" title="Windows 8">Windows 8</a>, the buttons are rectangular with sharp corners. A button with active <a href="Focus_(computing)" title="Focus (computing)">focus</a> is shown with a black dotted line just inside the border of the button. In addition, more recent versions, the default button is shown with a blue border. In <a href="Windows_Vista" title="Windows Vista">Windows Vista</a> and <a href="Windows_7" title="Windows 7">Windows 7</a>, the default button will slowly fade between its normal appearance and the blue border. Window management controls are in the upper right-hand corner of the application window, and, from left to right: "minimize" the window (causing it to disappear into the <a href="Taskbar" title="Taskbar">taskbar</a> at the bottom of the screen); <i>maximize</i> the window (causing it to expand to cover the whole <a href="Computer_monitor" title="Computer monitor">screen</a>; if the window is already maximized, the button will restore it to its previous size and position); and close the window.

</p>

<div class="mw-heading mw-heading3"><h3 id="Linux_and_other_Unix-like_systems">Linux and other Unix-like systems</h3></div>

<p>The appearance and behavior of buttons in <a href="Linux" title="Linux">Linux</a> and other Unix-like operating systems is defined primarily by which <a href="Widget_toolkit" title="Widget toolkit">widget toolkit</a> is being employed, the most popular being <a href="GTK" title="GTK">GTK</a> and <a href="Qt_(software)" title="Qt (software)">Qt</a>, though other toolkits are used as well. The use of multiple toolkits can lead to less uniform <a href="Look_and_feel" title="Look and feel">look and feel</a> across applications. Most widget toolkits also have theming capabilities, so there is no single standard appearance as there is with <a href="Mac_operating_systems" title="Mac operating systems">Mac OS</a> and <a href="Microsoft_Windows" title="Microsoft Windows">Windows</a>.

</p>

<div role="note" class="hatnote navigation-not-searchable">Further information: <a href="Web_widget" title="Web widget">Web widget</a></div>

<p>Buttons appear as elements of <a href="HTML_forms" class="mw-redirect" title="HTML forms">HTML forms</a> to carry out actions such as clearing user input or submitting the form contents to the server. Buttons specified in HTML may be rendered by <a href="Web_browser" title="Web browser">web browsers</a> in different ways, typically either using the native button appearance of the underlying <a href="Operating_system" title="Operating system">OS</a>, or by using a button definition from within the browser. Buttons may also be styled by the developer of the <a href="Web_site" class="mw-redirect" title="Web site">web site</a> the form appears on by using <a href="Cascading_style_sheets" class="mw-redirect" title="Cascading style sheets">cascading style sheets</a>.

</p><p><a href="HTML_anchor" class="mw-redirect" title="HTML anchor">HTML links</a> are sometimes represented by a graphic closely resembling a button. Sometimes this type of link is used in advertisements to induce the user to click the ad and visit the advertiser's site.

</p>

<div class="mw-heading mw-heading2"><h2 id="References">References</h2></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .reflist{margin-bottom:0.5em;list-style-type:decimal}@media screen{.mw-parser-output .reflist{font-size:90%}}.mw-parser-output .reflist .references{font-size:100%;margin-bottom:0;list-style-type:inherit}.mw-parser-output .reflist-columns-2{column-width:30em}.mw-parser-output .reflist-columns-3{column-width:25em}.mw-parser-output .reflist-columns{margin-top:0.3em}.mw-parser-output .reflist-columns ol{margin-top:0}.mw-parser-output .reflist-columns li{page-break-inside:avoid;break-inside:avoid-column}.mw-parser-output .reflist-upper-alpha{list-style-type:upper-alpha}.mw-parser-output .reflist-upper-roman{list-style-type:upper-roman}.mw-parser-output .reflist-lower-alpha{list-style-type:lower-alpha}.mw-parser-output .reflist-lower-greek{list-style-type:lower-greek}.mw-parser-output .reflist-lower-roman{list-style-type:lower-roman}

/* end https://en.wikipedia.org/ */

</style><div class="reflist">

<li id="cite_note-1"><span class="mw-cite-backlink"><b><a href="#cite_ref-1">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://foldoc.org/button">button</a> at <a href="FOLDOC" class="mw-redirect" title="FOLDOC">FOLDOC</a></span>

</li>

/* start https://en.wikipedia.org/ */

.mw-parser-output cite.citation{font-style:inherit;word-wrap:break-word}.mw-parser-output .citation q{quotes:"\"""\"""'""'"}.mw-parser-output .citation:target{background-color:rgba(0,127,255,0.133)}.mw-parser-output .id-lock-free.id-lock-free a{background:url("./mw/Lock-green.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-limited.id-lock-limited a,.mw-parser-output .id-lock-registration.id-lock-registration a{background:url("./mw/Lock-gray-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-subscription.id-lock-subscription a{background:url("./mw/Lock-red-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .cs1-ws-icon a{background:url("./mw/Wikisource-logo.svg")right 0.1em center/12px no-repeat}body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-free a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-limited a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-registration a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-subscription a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .cs1-ws-icon a{background-size:contain;padding:0 1em 0 0}.mw-parser-output .cs1-code{color:inherit;background:inherit;border:none;padding:inherit}.mw-parser-output .cs1-hidden-error{display:none;color:var(--color-error,#d33)}.mw-parser-output .cs1-visible-error{color:var(--color-error,#d33)}.mw-parser-output .cs1-maint{display:none;color:#085;margin-left:0.3em}.mw-parser-output .cs1-kern-left{padding-left:0.2em}.mw-parser-output .cs1-kern-right{padding-right:0.2em}.mw-parser-output .citation .mw-selflink{font-weight:inherit}@media screen{.mw-parser-output .cs1-format{font-size:95%}html.skin-theme-clientpref-night .mw-parser-output .cs1-maint{color:#18911f}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .cs1-maint{color:#18911f}}

/* end https://en.wikipedia.org/ */

</style><cite class="citation web cs1"><a rel="nofollow" class="external text" href="https://web.archive.org/web/20120402174040/https://developer.mozilla.org/en/XUL/button">"Mozilla button description"</a>. Archived from <a rel="nofollow" class="external text" href="https://developer.mozilla.org/en/XUL/button">the original</a> on 2012-04-02<span class="reference-accessdate">. Retrieved <span class="nowrap">2009-09-18</span></span>.</cite></span>

</li>

<li id="cite_note-3"><span class="mw-cite-backlink"><b><a href="#cite_ref-3">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="https://developer.mozilla.org/en/XUL/button#a-checkState">checkState button attribute</a> in <a href="Mozilla" title="Mozilla">Mozilla</a>'s <a href="XUL" title="XUL">XUL</a> <a rel="nofollow" class="external text" href="https://web.archive.org/web/20120402174040/https://developer.mozilla.org/en/XUL/button#a-checkState">Archived</a> 2012-04-02 at the <a href="Wayback_Machine" title="Wayback Machine">Wayback Machine</a></span>

</li>

</ol></div></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .hlist dl,.mw-parser-output .hlist ol,.mw-parser-output .hlist ul{margin:0;padding:0}.mw-parser-output .hlist dd,.mw-parser-output .hlist dt,.mw-parser-output .hlist li{margin:0;display:inline}.mw-parser-output .hlist.inline,.mw-parser-output .hlist.inline dl,.mw-parser-output .hlist.inline ol,.mw-parser-output .hlist.inline ul,.mw-parser-output .hlist dl dl,.mw-parser-output .hlist dl ol,.mw-parser-output .hlist dl ul,.mw-parser-output .hlist ol dl,.mw-parser-output .hlist ol ol,.mw-parser-output .hlist ol ul,.mw-parser-output .hlist ul dl,.mw-parser-output .hlist ul ol,.mw-parser-output .hlist ul ul{display:inline}.mw-parser-output .hlist .mw-empty-li{display:none}.mw-parser-output .hlist dt::after{content:": "}.mw-parser-output .hlist dd::after,.mw-parser-output .hlist li::after{content:" · ";font-weight:bold}.mw-parser-output .hlist dd:last-child::after,.mw-parser-output .hlist dt:last-child::after,.mw-parser-output .hlist li:last-child::after{content:none}.mw-parser-output .hlist dd dd:first-child::before,.mw-parser-output .hlist dd dt:first-child::before,.mw-parser-output .hlist dd li:first-child::before,.mw-parser-output .hlist dt dd:first-child::before,.mw-parser-output .hlist dt dt:first-child::before,.mw-parser-output .hlist dt li:first-child::before,.mw-parser-output .hlist li dd:first-child::before,.mw-parser-output .hlist li dt:first-child::before,.mw-parser-output .hlist li li:first-child::before{content:" (";font-weight:normal}.mw-parser-output .hlist dd dd:last-child::after,.mw-parser-output .hlist dd dt:last-child::after,.mw-parser-output .hlist dd li:last-child::after,.mw-parser-output .hlist dt dd:last-child::after,.mw-parser-output .hlist dt dt:last-child::after,.mw-parser-output .hlist dt li:last-child::after,.mw-parser-output .hlist li dd:last-child::after,.mw-parser-output .hlist li dt:last-child::after,.mw-parser-output .hlist li li:last-child::after{content:")";font-weight:normal}.mw-parser-output .hlist ol{counter-reset:listitem}.mw-parser-output .hlist ol>li{counter-increment:listitem}.mw-parser-output .hlist ol>li::before{content:" "counter(listitem)"\a0 "}.mw-parser-output .hlist dd ol>li:first-child::before,.mw-parser-output .hlist dt ol>li:first-child::before,.mw-parser-output .hlist li ol>li:first-child::before{content:" ("counter(listitem)"\a0 "}

/* end https://en.wikipedia.org/ */

</style><style data-mw-deduplicate="TemplateStyles:r1236075235">

/* start https://en.wikipedia.org/ */

.mw-parser-output .navbox{box-sizing:border-box;border:1px solid #a2a9b1;width:100%;clear:both;font-size:88%;text-align:center;padding:1px;margin:1em auto 0}.mw-parser-output .navbox .navbox{margin-top:0}.mw-parser-output .navbox+.navbox,.mw-parser-output .navbox+.navbox-styles+.navbox{margin-top:-1px}.mw-parser-output .navbox-inner,.mw-parser-output .navbox-subgroup{width:100%}.mw-parser-output .navbox-group,.mw-parser-output .navbox-title,.mw-parser-output .navbox-abovebelow{padding:0.25em 1em;line-height:1.5em;text-align:center}.mw-parser-output .navbox-group{white-space:nowrap;text-align:right}.mw-parser-output .navbox,.mw-parser-output .navbox-subgroup{background-color:#fdfdfd}.mw-parser-output .navbox-list{line-height:1.5em;border-color:#fdfdfd}.mw-parser-output .navbox-list-with-group{text-align:left;border-left-width:2px;border-left-style:solid}.mw-parser-output tr+tr>.navbox-abovebelow,.mw-parser-output tr+tr>.navbox-group,.mw-parser-output tr+tr>.navbox-image,.mw-parser-output tr+tr>.navbox-list{border-top:2px solid #fdfdfd}.mw-parser-output .navbox-title{background-color:#ccf}.mw-parser-output .navbox-abovebelow,.mw-parser-output .navbox-group,.mw-parser-output .navbox-subgroup .navbox-title{background-color:#ddf}.mw-parser-output .navbox-subgroup .navbox-group,.mw-parser-output .navbox-subgroup .navbox-abovebelow{background-color:#e6e6ff}.mw-parser-output .navbox-even{background-color:#f7f7f7}.mw-parser-output .navbox-odd{background-color:transparent}.mw-parser-output .navbox .hlist td dl,.mw-parser-output .navbox .hlist td ol,.mw-parser-output .navbox .hlist td ul,.mw-parser-output .navbox td.hlist dl,.mw-parser-output .navbox td.hlist ol,.mw-parser-output .navbox td.hlist ul{padding:0.125em 0}.mw-parser-output .navbox .navbar{display:block;font-size:100%}.mw-parser-output .navbox-title .navbar{float:left;text-align:left;margin-right:0.5em}body.skin--responsive .mw-parser-output .navbox-image img{max-width:none!important}@media print{body.ns-0 .mw-parser-output .navbox{display:none!important}}

/* end https://en.wikipedia.org/ */

</style></div><div role="navigation" class="navbox" aria-labelledby="Graphical_control_elements194" style="padding:3px"><table class="nowraplinks mw-collapsible autocollapse navbox-inner" style="border-spacing:0;background:transparent;color:inherit"><tbody><tr><th scope="col" class="navbox-title" colspan="2"><style data-mw-deduplicate="TemplateStyles:r1239400231">

/* start https://en.wikipedia.org/ */

.mw-parser-output .navbar{display:inline;font-size:88%;font-weight:normal}.mw-parser-output .navbar-collapse{float:left;text-align:left}.mw-parser-output .navbar-boxtext{word-spacing:0}.mw-parser-output .navbar ul{display:inline-block;white-space:nowrap;line-height:inherit}.mw-parser-output .navbar-brackets::before{margin-right:-0.125em;content:"[ "}.mw-parser-output .navbar-brackets::after{margin-left:-0.125em;content:" ]"}.mw-parser-output .navbar li{word-spacing:-0.125em}.mw-parser-output .navbar a>span,.mw-parser-output .navbar a>abbr{text-decoration:inherit}.mw-parser-output .navbar-mini abbr{font-variant:small-caps;border-bottom:none;text-decoration:none;cursor:inherit}.mw-parser-output .navbar-ct-full{font-size:114%;margin:0 7em}.mw-parser-output .navbar-ct-mini{font-size:114%;margin:0 4em}html.skin-theme-clientpref-night .mw-parser-output .navbar li a abbr{color:var(--color-base)!important}@media(prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .navbar li a abbr{color:var(--color-base)!important}}@media print{.mw-parser-output .navbar{display:none!important}}

/* end https://en.wikipedia.org/ */

</style><div id="Graphical_control_elements194" style="font-size:114%;margin:0 4em"><a href="Graphical_widget" title="Graphical widget">Graphical control elements</a></div></th></tr><tr><th scope="row" class="navbox-group" style="width:1%">Command input</th><td class="navbox-list-with-group navbox-list navbox-odd hlist" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Adjustment_handle" title="Adjustment handle">Adjustment handle</a></li>

<li><a href="Context_menu" title="Context menu">Context menu</a></li>

<li><a href="Hamburger_button" title="Hamburger button">Hamburger button</a></li>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Data input-output</th><td class="navbox-list-with-group navbox-list navbox-even hlist" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Checkbox" title="Checkbox">Checkbox</a></li>

<li><a href="Color_picker" title="Color picker">Color picker</a></li>

<li><a href="Combo_box" title="Combo box">Combo box</a></li>

<li><a href="Cycle_button" title="Cycle button">Cycle button</a></li>

<li><a href="Date_picker" title="Date picker">Date picker</a></li>

<li><a href="Toggle_switch_(widget)" title="Toggle switch (widget)">Toggle switch</a></li>

<li><a href="List_builder" title="List builder">List builder</a></li>

<li><a href="Radio_button" title="Radio button">Radio button</a></li>

<li><a href="Scrollbar" title="Scrollbar">Scrollbar</a></li>

<li><a href="Search_box" title="Search box">Search box</a></li>

<li><a href="Slider_(computing)" title="Slider (computing)">Slider</a></li>

<li><a href="Spinner_(computing)" title="Spinner (computing)">Spinner</a></li>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Informational</th><td class="navbox-list-with-group navbox-list navbox-odd hlist" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Balloon_help" title="Balloon help">Balloon help</a></li>

<li><a href="HUD_(computing)" class="mw-redirect" title="HUD (computing)">Head-up display in computing</a></li>

<li><a href="HUD_(video_gaming)" class="mw-redirect" title="HUD (video gaming)">HUD in video games</a></li>

<li><a href="Infobar" title="Infobar">Infobar</a></li>

<li><a href="Label_(control)" title="Label (control)">Label</a></li>

<li><a href="Loading_screen" title="Loading screen">Loading screen</a></li>

<li><a href="Progress_indicator" title="Progress indicator">Progress indicator</a>

<ul><li><a href="Progress_bar" title="Progress bar">Progress bar</a></li>

<li><a href="Splash_screen" title="Splash screen">Splash screen</a></li>

<li><a href="Throbber" title="Throbber">Throbber</a></li></ul></li>

<li><a href="Sidebar_(computing)" title="Sidebar (computing)">Sidebar</a></li>

<li><a href="Status_bar" title="Status bar">Status bar</a></li>

<li><a href="Pop-up_notification" title="Pop-up notification">Toast</a></li>

<li><a href="Tooltip" title="Tooltip">Tooltip</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Containers</th><td class="navbox-list-with-group navbox-list navbox-even hlist" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Accordion_(GUI)" title="Accordion (GUI)">Accordion</a></li>

<li><a href="Client-side_decoration" title="Client-side decoration">Client-side decoration</a></li>

<li><a href="Disclosure_widget" title="Disclosure widget">Disclosure widget</a></li>

<li><a href="Frame_(GUI)" title="Frame (GUI)">Frame / Fieldset</a></li>

<li><a href="Panel_(computer_software)" title="Panel (computer software)">Panel</a></li>

<li><a href="Popover_(GUI)" title="Popover (GUI)">Popover</a></li>

<li><a href="Ribbon_(computing)" title="Ribbon (computing)">Ribbon</a></li>

<li><a href="Toolbar" title="Toolbar">Toolbar</a></li>

<li><a href="Window_(computing)" title="Window (computing)">Window</a>

<ul><li><a href="Window_decoration" class="mw-redirect" title="Window decoration">Window decoration</a></li></ul></li>

<li><a href="Workspace" title="Workspace">Workspace</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Navigational</th><td class="navbox-list-with-group navbox-list navbox-odd hlist" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Address_bar" title="Address bar">Address bar</a></li>

<li><a href="Breadcrumb_navigation" title="Breadcrumb navigation">Breadcrumb navigation</a></li>

<li><a href="Hyperlink" title="Hyperlink">Hyperlink</a></li>

<li><a href="Navigation_bar" title="Navigation bar">Navigation bar</a></li>

<li><a href="Virtual_desktop" title="Virtual desktop">Virtual desktop</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><span class="nowrap">Special <a href="Window_(computing)" title="Window (computing)">windows</a></span></th><td class="navbox-list-with-group navbox-list navbox-even hlist" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Alert_dialog_box" title="Alert dialog box">Alert dialog box</a></li>

<li><a href="Dialog_box" title="Dialog box">Dialog box</a></li>

<li><a href="File_dialog" title="File dialog">File dialog</a></li>

<li><a href="Inspector_window" title="Inspector window">Inspector window</a></li>

<li><a href="Modal_window" title="Modal window">Modal window</a></li>

<li><a href="Palette_window" title="Palette window">Palette window</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Related concepts</th><td class="navbox-list-with-group navbox-list navbox-odd hlist" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="File_viewer" title="File viewer">File viewer</a></li>

<li><a href="List_of_graphical_user_interface_elements" title="List of graphical user interface elements">List of graphical user interface elements</a></li>

<li><a href="Layout_manager" title="Layout manager">Layout manager</a></li>

<li><a href="Mouseover" title="Mouseover">Mouseover</a></li>

<li><a href="Scrolling" title="Scrolling">Scrolling</a></li>

<li><a href="Widget_toolkit" title="Widget toolkit">Widget toolkit</a></li>

<li><a href="Zoomable_user_interface" class="mw-redirect" title="Zoomable user interface">Zoomable user interface</a></li></ul>

</div></td></tr></tbody></table></div></div><div><div class="zim-footer">

This article is issued from <a class="external text" title="Last edited on 2025-06-18" href="https://en.wikipedia.org/wiki/?title=Button_(computing)&oldid=1296150688">Wikipedia</a>. The text is available under <a class="external text" href="https://creativecommons.org/licenses/by-sa/4.0/deed.en">Creative Commons Attribution-Share Alike 4.0</a> unless otherwise noted. Additional terms may apply for the media files.

</div>

</div></div>

</div>

</main>

</div>

</body></html>